// import { SidebarTrigger } from "@/components/ui/sidebar";
// import { AuthButton } from "@/modules/auth/ui/components/auth-button";
"use client"
import Image from "next/image";
import Link from "next/link";
import { AuthButton } from "../auth/auth-button";
import { GitBranchPlus, GithubIcon, Loader2, Loader2Icon, PlusIcon } from "lucide-react";
import { Button } from "@/components/ui/button";
import { useRouter, usePathname } from 'next/navigation'
import { useSession } from "next-auth/react"
import { ModeToggle } from "@/components/switch-theme";
export const HomeNavbar = () => {
  const router = useRouter()
  const pathname = usePathname()
  const { data: session } = useSession()
  const { user } = session || {};
  const goCearte = () => {
    router.push("/new")
  }
  return (
    <nav className=" fixed top-0 left-0 right-0 h-16  flex items-center px-2 pr-5 z-50 shadow-md border-sky-200">
      <div className="flex items-center gap-4 w-full">
        {/* Menu and Logo */}
        <div className="flex items-center shrink-0">
          {/* <SidebarTrigger /> */}

          <Link href={"/"}>
            <div className="flex items-center gap-1 p-4">
              <p className="text-xl font-semibold tracking-tight">Nextjs crud</p>
            </div>
          </Link>
        </div>

        {/* Search bar */}
        <div className="flex-1 flex justify-center max-w-[720px] mx-auto">
          {/* <SearchInput /> */}
        </div>

        <div className="shrink-0 items-center flex gap-4 ">
          <div className="w-full flex items-center justify-center">
            {user && pathname === '/' && <Button variant={"secondary"} className="mr-3" onClick={() => { goCearte() }}>
              <PlusIcon />
              Create
            </Button>}
            <AuthButton></AuthButton>
            <Button className="ml-2" variant={"secondary"}>
              <Link href={'https://gitee.com/kang841331654/nextjs-trpc-crud'}>
                <GithubIcon></GithubIcon>
              </Link>
            </Button>
            <div className="ml-2">
              <ModeToggle></ModeToggle>
            </div>
          </div>
        </div>
      </div>
    </nav>
  );
};